﻿@{
    ViewBag.Title = "Thông Báo Mới";
}
@model ORM.ViewModels.Account.NotificationViewModel
<table class="contentBox" style="width: 100%; height: 500px">
    <tr>
        <th class="boxTitle">
            Thông Báo Mới
        </th>
    </tr>
    <tr>
        <td style="vertical-align: top; padding-top: 10px; width: 100%">
            <div id="questionTabs" class="css-tabs" style="height: 33px;">
                <ul class="menu" id="" style="height: 100%">
                    <li id="tabs-1" style="height: 100%"><a href="#tabs-1" id="tab1" style="border-bottom: solid 1px white"
                        onclick="fcOn()">Bình Luận Mới (@Model.Comments.Count())</a> </li>
                    <li id="tabs-2" style="height: 100%"><a href="#tabs-2" id="tab2" onclick="fcOn2()">Trả
                        Lời Mới (@Model.Answers.Count())</a> </li>
                </ul>
            </div>
            <table id="table1" style="display: table; border-top: solid 1px #808080; width: 100%">
                <tr>
                    <td style="vertical-align: top; padding-top: 20px">
                        @foreach (var item in Model.Comments)
                        {
                            <div>
                                <img src="/Content/Images/Comment.ico" width="20px" height="20px" />
                                <a class="titleLink" href="/Account/Details/@item.PostBy.Id">@item.PostBy.Username</a> mới bình
                                luận trong bài hướng dẫn 
                                <a class="titleLink" href="/Guide/Details/@item.Guide.Id">@item.Guide.Title</a> của bạn<br/>
                                <span style="color: gray; padding-left: 25px">@Convert.ToDateTime(item.PostedDate).ToString("HH:mm") ngày @Convert.ToDateTime(item.PostedDate).ToString("dd-MM-yyyy")</span><br />
                            </div>
                            }
                    </td>
                </tr>
            </table>
            <table id="table2" style="display: none; border-top: solid 1px #808080; width: 100%">
                <tr>
                    <td style="vertical-align: top; padding-top: 30px">
                        @foreach (var item in Model.Answers)
                        {
                            <div>
                                <img src="/Content/Images/Comment.ico" width="20px" height="20px" />
                                <a class="titleLink" href="/Account/Details/@item.PostedBy.Id">@item.PostedBy.Username</a> mới trả lời cho câu hỏi 
                                <a class="titleLink" href="/Question/Details/@item.QuestionId">@item.Question.Title</a> của bạn<br/>
                                <span style="color: gray; padding-left: 25px">@Convert.ToDateTime(item.PostedDate).ToString("HH:mm") ngày @Convert.ToDateTime(item.PostedDate).ToString("dd-MM-yyyy")</span><br />
                            </div>
                            }
                    </td>
                </tr>
            </table>
            <br />
        </td>
    </tr>
</table>
<script type="text/javascript">
    function fcOn() {
        document.getElementById("table1").style.display = "table";
        document.getElementById("table2").style.display = "none";
        document.getElementById("tab2").style.borderBottom = "1px solid #808080";
        document.getElementById("tab1").style.borderBottom = "solid 1px white";
    }
    function fcOn2() {
        document.getElementById("table1").style.display = "none";
        document.getElementById("table2").style.display = "table";
        document.getElementById("tab1").style.borderBottom = "1px solid #808080";
        document.getElementById("tab2").style.borderBottom = "solid 1px white";
    }
</script>